<template lang="html">
  <div id="minePage">
    <div class="header">

        <div class="content">
            <router-link to="/mineDetail" class="vip">
                <img class="avatar" :src='(userData.hasOwnProperty("headimgurl") && userData.headimgurl.length>5)?userData.headimgurl:"/static/images/default_avatar-v2.png"'  alt="">
                <!--<img class="level" :src="levelImg" alt="">-->
            </router-link>
            <span class="nickname">{{myNickname}}</span>
            <router-link to="/rechargeCenter" class="toRechargeCenter"><span>充值</span></router-link>
        </div>

    </div>
    <div class="orderContainer">

          <router-link to="/orders/tab2Active">
            <img src="../../static/images/icon_tobePaid-v2.png" alt="">
            <div class="status">
                <span class="redCircle" v-if="isShowCircle">{{tobePaidNum}}</span>
                <span class="unpay">待付款</span>
            </div>

          </router-link>
          <router-link to="/orders/tab3Active">
            <img src="../../static/images/icon_endPaid-v2.png" alt="">
            <div  class="status">已完成</div>
          </router-link>
          <router-link to="/orders/tab1Active" class="all">

                <img src="../../static/images/icon_allPaid-v2.png" alt="">
                <div  class="status">全部</div>


            <!--<img class="next" src="../../static/images/icon_next.png" alt="">-->
          </router-link>
    </div>
    <ul class="userDetail">
        <li class="item ">
            <router-link  to="/balance">
                <div class="item-left">
                    <img src="../../static/images/mine_balance-v2.png">
                    <span>余额明细</span>
                </div>
                <div class="item-right">
                    <span class="first">{{valueData.balance==null?"0.00":valueData.balance }}元</span>
                    <img src="../../static/images/icon_next.png" alt="">
                </div>
            </router-link>
        </li>
        <li class="item ">
            <router-link  v-bind:to=" '/grow_up/ '+valueData.empirical ">
                <div class="item-left">
                    <img src="../../static/images/grow_up-v2.png">
                    <span>成长值明细</span>
                </div>
                <div class="item-right">
                    <span class="sec">{{valueData.empirical }}</span>
                    <img src="../../static/images/icon_next.png">
                </div>
            </router-link>
        </li>
         <li class="item ">
            <router-link  to="/memberInfo ">
                <div class="item-left">
                    <img src="../../static/images/mine_vip-v2.png">
                    <span>会员专区</span>
                </div>
                <div class="item-right">
                    <img src="../../static/images/icon_next.png">
                </div>
            </router-link>
        </li>
        <li class="item ">
            <router-link  to="/mineDetail ">
                <div class="item-left">
                    <img src="../../static/images/icon_face-v2.png">
                    <span>人脸识别</span>
                </div>
                <div class="item-right">
                    <!--<span class="sec">{{valueData.empirical }}</span>-->
                    <img src="../../static/images/icon_next.png">
                </div>
            </router-link>
        </li>
        <!-- <li class="item ">
            <router-link  to="/unmannedLogin">
                <div class="item-left">
                    <img src="../../static/images/icon_face-v2.png">
                    <span>盒子注册</span>
                </div>
                <div class="item-right">
                    <img src="../../static/images/icon_next.png">
                </div>
            </router-link>
        </li> -->




    </ul>

<div style="width:100%;height:50px;background:#f4f4f4;"></div>

  </div>
</template>
<script>
    import axios from 'axios'
    import { Indicator } from 'mint-ui';
    import router from '../router/router'


    export default {
        data: function() {
            return {
                valueData: "",
                imgUrl: "",
                userData: "",
                levelImg: "",
                isShowCircle: false,
                baseUrl: "/static/images/",
                tobePaidNum:"",
                // baseUrl: "../../static/images/",
                myNickname:""

            }
        },
        created: function() {
            // var userInfo=JSON.stringify({"code":200,"des":"185****6534","obj":{"id":2,"mobile":"","nickname":"a公子小白hahah哈哈哈","sex":"2","province":"北帕默斯顿","city":"","country":"新西兰","headimgurl":"http://wx.qlogo.cn/mmopen/8h9QXaJ70ibdmxiabMMkyG4wHFYxggcVcOa4ohbh5Jg5f3cvZljMibqTn5KHd17gN2l89FzEqlZ9zNDBl9oIrkuc8d6KiaeJA8ic0/0","privilege":null,"unionid":null,"createTime":null,"createName":null,"updateTime":null,"updateName":null,"yn":null,"openid":"o0TiWwzPcldQZy4LE0D_OQogKkPA","level":"01","barCode":"14895667730410071"}});
            // store.set("userInfo",userInfo)

            Indicator.close()
            //判断用户是否登录
            if (store.get('userInfo') == "") {
                //router.replace("/login");
            } else {
                moveAction()
                this.getPreOrders()
                var _this = this;
                this.$store.commit('isLoading', true)

                this.$store.commit('changeIndexConf', {
                    isFooter: true,
                    isToast: false,

                });

                //var openId = JSON.parse(store.get("user")).openid
                    //获取用户的级别/二维码等
                var userInfo = JSON.parse(store.get("userInfo"));
                //console.log("...",userInfo);
                if (!userInfo.obj.nickname) {
                    this.myNickname="麦铺小粉丝";
                }else{
                    this.myNickname= userInfo.obj.nickname.length>8 ?  userInfo.obj.nickname.substr(0,8)+"..." :  userInfo.obj.nickname;
                }
                this.userData = userInfo.obj;
                this.vipLevel(userInfo.obj.level);

                axios.get('/member/getBalance.do')
                    .then(function(response) {
                        // console.log(response);
                        _this.valueData = response.data;
                        _this.$store.commit('isLoading', false)
                        store.set("userBalance", response.data.balance.toFixed(2));

                    })
                    .catch(function(error) {
                        // console.log(error);
                    });
            }





        },
        mounted: function() {
            $(".com-app").css("background","#f6f6f6")
            // console.log($('#qrcodeImg'));
            if (store.get('userInfo') == "") {
                //router.push("/login");
            } else {

                this.$store.commit('isLoading', true);

            }





        },
        methods: {
            vipLevel: function(level) {
                switch (level) {
                    case "01":
                        this.levelImg = this.baseUrl + "iron_vip.png";
                        break;
                    case "02":
                        this.levelImg = this.baseUrl + "bronze_vip.png";
                        break;
                    case "03":
                        this.levelImg = this.baseUrl + "whiteSliver_vip.png";
                        break;
                    case "04":
                        this.levelImg = this.baseUrl + "gold_vip.png";
                        break;
                    case "05":
                        this.levelImg = this.baseUrl + "platina_vip.png";
                        break;
                    case "06":
                        this.levelImg = this.baseUrl + "diamond_vip.png";
                        break;
                    case "A1":
                        this.levelImg = this.baseUrl + "teach_vip.png";
                        break;
                    case "A2":
                        this.levelImg = this.baseUrl + "extreme_vip.png";
                        break;
                    case "A3":
                        this.levelImg = this.baseUrl + "community_vip.png";
                        break;

                    default:
                        this.levelImg = this.baseUrl + "new_vip.png";
                        break;
                }
                // console.log(this.levelImg)

            },

            getPreOrders: function() {
                var _this = this;
                axios.get('/order/getGoodsOrder.do', {
                        params: {
                            status: "PRE"
                        }
                    })
                    .then(function(response) {
                        if (response.data.obj == null || response.data.obj.length == 0) {
                            _this.tobePaidNum= response.data.obj.length;
                            _this.isShowCircle = false;
                        } else {
                             _this.tobePaidNum= response.data.obj.length;
                            _this.isShowCircle = true;
                        }
                    })
                    .catch(function(error) {
                        // console.log(error);
                    });
            }

        },

        computed: {}
    }
</script>

<style lang="scss" scoped>
    @import "../../static/css/mine.scss";
</style>
